<!-- 外部来文-详情 -->
<template>
  <el-row class="detail-wrap">
    <el-tabs v-model="activeName" class="detail-wrap__tabs">
      <el-tab-pane label="基本信息" name="first">
        <AllInfo ref="allInfo" @updateBaseInfo="updateBaseInfo" :isCbxx="isCbxx" />
      </el-tab-pane>
      <el-tab-pane label="工作流程图" name="second" >
        <work-flow v-if="activeName === 'second'"></work-flow>
      </el-tab-pane>
      <!-- <el-tab-pane label="流程图" name="third">
        <no-record></no-record>
      </el-tab-pane> -->
    </el-tabs>
    <el-row class="detail-wrap__btns">
      <dg-button
        v-if="isShowJudgeBtn"
        v-permission="['XXXX_YP']"
        size="mini"
        :disabled="!(baseInfo.signInVO && baseInfo.signInVO.id)"
        @click="() => $router.push({ name: judgeRouterName, params: { id: flowId } })"
      >
        研判
      </dg-button>

      <dg-button v-permission="['XXXX_LDGZ']" size="mini" @click="onFollow('isLdgz')">
        <span v-if="+baseInfo.isLdgz === 1"><i class="el-icon-star-on"></i>取消其他领导关注</span>
        <span v-else><i class="el-icon-star-off"></i>其他领导关注</span>
      </dg-button>
      <dg-button v-permission="['XXXX_JLDGZ']" size="mini" @click="onFollow('isJldgz')">
        <span v-if="+baseInfo.isJldgz === 1"><i class="el-icon-star-on"></i>取消局领导关注</span>
        <span v-else><i class="el-icon-star-off"></i>局领导关注</span>
      </dg-button>

      <dg-button size="mini" v-permission="['XXXX_GLXX']" @click="openRelateInfo">关联信息</dg-button>

      <dg-button
        v-permission="['XXXX_EDIT']"
        size="mini"
        v-if="!(baseInfo.signInVO && baseInfo.signInVO.id)"
        @click="() => $router.push({ name: editRouterName, params: { id: flowId } })"
      >
        编辑
      </dg-button>
      <dg-button
        size="mini"
        v-permission="['XXXX_XG']"
        @click="() => $router.push({ name: modifyRouterName, params: { id: flowId } })"
      >
        修改
      </dg-button>

      <el-dropdown @command="handleCommand">
        <el-button size="mini">更多 <i class="el-icon-arrow-down el-icon--right"></i></el-button>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item v-permission="['XXXX_GLZT']" command="relateSpecial">关联专题</el-dropdown-item>
          <el-dropdown-item
            v-permission="['XXXX_DELETE']"
            v-if="!(baseInfo.signInVO && baseInfo.signInVO.id)"
            command="delete"
            >删除</el-dropdown-item
          >
           <el-dropdown-item v-permission="['XXXX_PRINT']" @click="openPrintPage(baseInfo)">打印</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </el-row>
  </el-row>
</template>

<script>
import AllInfo from '@/pages/ExterCommun/detail/components/AllInfo';
import WorkFlow from '@/pages/ExterCommun/detail/components/WorkFlow';
import {saveFlowConcern, deleteFlowConcern, onToRelated, deleteProcess, printYaxx} from '@/api/common';
import {BM_DEPT} from "@/common/codeDic";

export default {
  name: 'ExterCommunDetail',
  components: {
    AllInfo,
    WorkFlow
  },
  data() {
    return {
      baseInfo: {},
      currentIndex: 0,
      activeName: 'first',
      isCbxx:this.$route.params.isCbxx, // 情报线索信息（情报）--详情中不显示呈报信息
    };
  },
  computed: {
    isShowJudgeBtn() {
      return this.$route.name === 'AllBureausDetail' || this.$route.name === 'LocalBureausDetail';
    },
    flowId() {
      return this.$route.params.id || '';
    },
    editRouterName() {
      let routeName = '';
      // 0-外部来文；1-要情上报；2-线索上报；3-110报警信息（情报）-研判；4-线索（情报特有）；5-110报警处理
      switch (this.baseInfo.sourceType) {
        case '0':
          routeName = 'EditExterCommun';
          break;
        case '1':
          routeName = 'EditImp';
          break;
        case '2':
          routeName = 'AllBureausEdit';
          break;
        case '4':
          routeName = 'LocalBureausEdit';
          break;
        default:
          routeName = 'EditExterCommun';
      }
      return routeName;
    },
    modifyRouterName() {
      let routeName = '';
      switch (this.baseInfo.sourceType) {
        case '0':
          routeName = 'ExterCommunModify';
          break;
        case '1':
          routeName = 'ImpModify';
          break;
        case '2':
          routeName = 'AllBureausModify';
          break;
        case '4':
          routeName = 'LocalBureausModify';
          break;
        default:
          routeName = 'ExterCommunModify';
      }
      return routeName;
    },
    judgeRouterName() {
      return this.$route.name === 'AllBureausDetail' ?'AllBureausJudge':'LocalBureausJudge';
    }
  },
  methods: {
    onJudge() {
      //  this.$router.push({ path: `/clue-management/all-bureaus/judge/${this.flowId}` });
    },
    handleCommand(val) {
      if (val === 'relateSpecial') {
        this.openRelateSpecial();
        return;
      }
      if (val === 'delete') {
        this.onDelete();
        return;
      }
      if (val === 'print') {
        return;
      }
    },
    onDelete() {
      this.$confirm('确认删除此数据?').then(() => {
        const loadingInstance = this.$loading({
          lock: true,
          text: '删除中...',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        deleteProcess(this.flowId)
          .then(() => {
            this.$message.success('删除成功');
            this.$router.go(-1);
            loadingInstance.close();
          })
          .catch(() => {
            loadingInstance.close();
            this.$message.warning('删除失败');
          });
      });
    },
    updateBaseInfo(data) {
      this.baseInfo = JSON.parse(JSON.stringify(data));
      console.log(this.baseInfo, 666);
    },
    /**
     * @description: 关注/取消关注
     * @param {Stirng} key 局领导isJldgz/领导isLdgz
     * @return {void}
     */
    onFollow(key) {
      // 未关注-0 已关注-1
      const requestObj = {
        0: {
          func: saveFlowConcern,
          params: {
            flowId: this.flowId,
            gzlb: key === 'isJldgz' ? 1 : 2
          }
        },
        1: { func: deleteFlowConcern, params: key === 'isJldgz' ? this.baseInfo.jldgzId : this.baseInfo.ldgzId }
      };
      requestObj[this.baseInfo[key]].func(requestObj[this.baseInfo[key]].params).then((res) => {
        // TODO 更新基本信息，基于当前的组件结构只能这么写了
        this.$refs.allInfo.$refs.baseInfo.fetchDetail();
      });
    },
    handleTitleTo(index) {
      this.currentIndex = index;
    },
    handleScrollEvent() {},
    openRelateInfo() {
      const _this = this;
      const glxx_columns = [
        { label: '序号', type: 'index', width: 70 },
        { label: '上报时间', prop: 'sendTime' },
        { label: '信息编号', prop: 'serialNo', width: 300},
        { label: '标题', prop: 'title', width: 300},
        { label: '上报单位', prop: 'createOrgCode',code:BM_DEPT },

      ];
      this.$dgLayer({
        title: '关联信息',
        component: require('@/pages/ExterCommun/add/components/InfoModal'),
        area: ['60%', '480px'],
        props: {
          id: this.flowId,
          isCheckSelectAuth: true, // 是否进行勾选权限
          selectRule: {isAssociation: '0'},
          columnData: glxx_columns
        },
        on: {
          onRelate(data) {
            const gldxType = 1;
            const flowMainAssociationList = data.map((item) => {
              return {
                flowId: _this.flowId,
                gldxId: item.id,
                gldxType
              };
            });
            onToRelated(flowMainAssociationList)
              .then((res) => {
                _this.$refs.allInfo.$refs.relateInfo.onRefresh();
                _this.$message.success('关联成功');
              })
              .catch(() => {
                _this.$message.error('关联失败');
              });
          }
        }
      });
    },
    openRelateSpecial() {
      const _this = this;
      this.$dgLayer({
        title: '关联专题',
        component: require('@/pages/ExterCommun/add/components/SpecialModal'),
        area: ['60%', '480px'],
        props: { id: this.flowId },
        on: {
          onRelate(data) {
            const gldxType = 2;
            const flowMainAssociationList = data.map((item) => {
              return {
                flowId: _this.flowId,
                gldxId: item.id,
                gldxType
              };
            });
            onToRelated(flowMainAssociationList)
              .then((res) => {
                _this.$refs.allInfo.$refs.relateSubject.fetchList();
                _this.$message.success('关联成功');
              })
              .catch(() => {
                _this.$message.error('关联失败');
              });
          }
        }
      });
    },
    /**
     * 打印
     */
    openPrintPage(row){
      let doc_name = '公安要情呈报单';
      let doc_id = row.id;
      let type = '1';
      printYaxx(doc_id, doc_name, type);
    }
  }
};
</script>

<style lang="scss" scoped>
.detail-wrap {
  position: relative;
  background-color: #fff;
  &__btns {
    position: absolute;
    top: 8.5px;
    right: 25px;
  }
  /deep/.el-tabs__item {
    height: 50px;
    line-height: 50px;
    font-size: 1rem;
  }
  /deep/.el-tabs__header {
    margin: 0 0 7px;
  }
  /deep/.el-tabs__item.is-active {
    font-weight: bold;
  }
  /deep/ &__tabs > .el-tabs__header .el-tabs__nav-wrap {
    padding-left: 33px;
  }
}

.work-flow {
  padding: 2rem;
}
</style>
